<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
String path=request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>后台管理</title>
	<jsp:include page="/static/commonjsp/head-js.jsp" flush="true"/>
</head>
	 <body>
	    <div class="x-nav">
	      <span class="layui-breadcrumb">
	        <a href="">首页</a>
	        <a href="">角色管理</a>
	        <a>
	          <cite>角色列表</cite></a>
	      </span>
	      <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
	        <i class="layui-icon" style="line-height:30px">ဂ</i></a>
	    </div>
	    <div class="x-body">
	      <div class="layui-row">
	        <form class="layui-form layui-col-md12 x-so">
	          <input class="layui-input" placeholder="开始日" name="start" id="start">
	          <input class="layui-input" placeholder="截止日" name="end" id="end">
	          <input type="text" name="username"  placeholder="请输入用户名" autocomplete="off" class="layui-input">
	          <button class="layui-btn"  lay-submit="" lay-filter="sreach"><i class="layui-icon">&#xe615;</i></button>
	        </form>
	      </div>
	      <xblock>
	        <button class="layui-btn layui-btn-danger" onclick="delAll()"><i class="layui-icon"></i>批量删除</button>
	        <button class="layui-btn" onclick="x_admin_show('添加用户','${pageContext.request.contextPath}/admin/roleadd')"><i class="layui-icon"></i>添加</button>
	        <span class="x-right" style="line-height:40px">共有数据：${roles.total}条</span>
	      </xblock>
	      <table class="layui-table">
	        <thead>
	          <tr>
	            <th>
	              <div class="layui-unselect header layui-form-checkbox" lay-skin="primary"><i class="layui-icon">&#xe605;</i></div>
	            </th>
	            <th>ID</th>
	            <th>角色名</th>
	            <th>拥有权限规则</th>
	            <th>描述</th>
	            <th>状态</th>
	            <th>操作</th>
	        </thead>
	        <tbody>
	        <c:forEach items="${roles.list}" var="item">
	        	 <tr>
		             <td>
		                <div class="layui-unselect layui-form-checkbox" lay-skin="primary" data-id='${item.id}'><i class="layui-icon">&#xe605;</i></div>
		             </td>
		             <td>${item.id}</td>
		             <td>${item.roleName}</td>
		             <td>${item.roleInformation}</td>
		             <td>${item.roleInformation}</td>
		             <td class="td-status">
		                 <span class="layui-btn layui-btn-normal layui-btn-mini">已启用</span>
		             </td>
		             <td class="td-manage">
		                 <a onclick="member_stop(this,'10001')" href="javascript:;"  title="启用">
		                	 <i class="layui-icon">&#xe601;</i>
		                 </a>
		                 <a title="编辑"  onclick="x_admin_show('编辑','${pageContext.request.contextPath}/admin/roleedit?id=${item.id}')" href="javascript:;">
		                	 <i class="layui-icon">&#xe642;</i>
		                 </a>
		                 <a title="删除" onclick="member_del(this,'${item.id}')" href="javascript:;">
		                 	<i class="layui-icon">&#xe640;</i>
		                 </a>
			          </td>
		          </tr>
	        </c:forEach>
	         
	        </tbody>
	        
	      </table>
	      <div class="page">
	        <div>
	          ${page}
	        </div>
	      </div>
	
	    </div>
	    <script>
	      layui.use('laydate', function(){
	        var laydate = layui.laydate;
	        
	        //执行一个laydate实例
	        laydate.render({
	          elem: '#start' //指定元素
	        });
	
	        //执行一个laydate实例
	        laydate.render({
	          elem: '#end' //指定元素
	        });
	      });
	
	       /*用户-停用*/
	      function member_stop(obj,id){
	          layer.confirm('确认要停用吗？',function(index){
	
	              if($(obj).attr('title')=='启用'){
	
	                //发异步把用户状态进行更改
	                $(obj).attr('title','停用')
	                $(obj).find('i').html('&#xe62f;');
	
	                $(obj).parents("tr").find(".td-status").find('span').addClass('layui-btn-disabled').html('已停用');
	                layer.msg('已停用!',{icon: 5,time:1000});
	
	              }else{
	                $(obj).attr('title','启用')
	                $(obj).find('i').html('&#xe601;');
	
	                $(obj).parents("tr").find(".td-status").find('span').removeClass('layui-btn-disabled').html('已启用');
	                layer.msg('已启用!',{icon: 5,time:1000});
	              }
	              
	          });
	      }
	
	      /*用户-删除*/
	      function member_del(obj,id){
	          layer.confirm('确认要删除吗？',function(index){
	              //发异步删除数据
	               $.ajax({
		        	url:"${pageContext.request.contextPath}/admin/roledelete",
					type:"POST",
					data:{id:id},
					dataType:'json',
					success:function(result){
						if(result.success){
						 	layer.alert(result.msg, {icon: 6});
						}
					},
		        	error:function(){
		        		layer.alert("请求服务器失败", {icon: 6});
		        	}
		        })
	              $(obj).parents("tr").remove();
	              layer.msg('已删除!',{icon:1,time:1000});
	          });
	      }
	
	      function delAll (argument) {
	
	        var data = tableCheck.getData();
	  
	        layer.confirm('确认要删除吗？'+data,function(index){
	            //捉到所有被选中的，发异步进行删除
	            layer.msg('删除成功', {icon: 1});
	            $(".layui-form-checked").not('.header').parents('tr').remove();
	        });
	      }
	    </script>
	    
	    <script type="text/javascript">
	    
	    </script>
  </body>
</html>

